<template>
  <div class="backimg" ref="backimg">
    <!-- <img :src="imgSrc1" id=""> -->
  </div>
</template>

<script>
  export default {
    name:'homepage',
    data(){
      return {
        imgSrc1:require('./../assets/images/飞机.png'),
      }
    },
    mounted () {
      // console.log(window.screen.height)
      // console.log(document.querySelector('#navigation').offsetHeight)
      
      // this.$refs.backimg.style.backgroundColor="#ff0000"
      // console.log(this.$refs.backimg.style)
      // this.$refs.backimg.style.height=(window.screen.height - document.querySelector('#navigation').offsetHeight)+'px'
      // this.$refs.backimg.style.background='url(bgimg.gif) no-repeat 5px 5px;'
      // var tt = document.body.clientHeight || document.documentElement.clientHeight;
      // this.$refs.backimg.style.height = tt + 'px'; //动态设置HTML元素高度
      // console.log(tt);
    },
  }
</script>

<style>
  body {
    height:100%;
  }
  #app {
    height:100%;
  }
  .backimg {
    width:100%;
    height:91%;
    background: url(./../assets/images/飞机.png) no-repeat center;
    background-size:100% 100% ;
    
  }
  #navigation {
    height:9%;
    box-sizing: border-box;
  }
  .backimg img {
      width:100%
    }
  
</style>
